import React,{Component} from "react";
import H5Tailer from "../../components/H5Tailer";
import "./index.css";

export default class H5TrainingCamp extends Component {
    render() {
        return (
            <div className="container">

                <header>
                    <a href="#!"><img alt="1" src="img/logo.png" className="logo" /></a>
                    <a href="#!" className="navMenu"><img alt="1" src="img/menu.png" /></a>
                </header>
                <div className="banner xly-banner">
                    <h1>实战训练营</h1>
                    <p>行业实战项目导向，训战结合，<br/>解决数字化转型难题</p>
                    <a href="#!">获取定制方案</a>
                </div>
                <nav>
                    <a href="#!"><span className="on">产品概述</span></a>
                    <a href="#!">产品特点</a>
                    <a href="#!">培训方式</a>
                    <a href="#!">大赛主题</a>
                </nav>
                <div className="overview">
                    <h1 className="h1Tit">产品概述</h1>
                    <p className="subTit">实战训练营是基于业务场景的学习情境设计，以项目为导向的短期集训模式。针对具体项目或问题，不拘泥线上、线下或者混合式学习，它能帮助企业和员工：</p>
                    <img alt="1" src="img/img_04/xly_01.png" className="img-full"/>
                </div>
                <div className="topic bg-grey02">
                    <h1 className="h1Tit">产品特点</h1>
                    <div className="topicBox">
                        <div className="t-title">
                            <span>创新产品形态</span>
                            <a href="#!"><img alt="1" src="img/open.png"/><img alt="1" src="img/close.png" style={{display: 'none'}}/></a>
                        </div>
                        <div className="t-content">
                            <p>创新产品形态</p>
                            <div className="line"></div>
                            <img alt="1" src="img/img_04/xly_03.png"/>
                            <p className="other-t">提供直播、录播、AI互动交互式剧本、场景互动剧本等多种学习形态，实现智慧学习。</p>
                        </div>
                    </div>
                    <div className="topicBox">
                        <div className="t-title">
                            <span>重服务强运营</span>
                            <a href="#!"><img alt="1" src="img/open.png"/><img alt="1" src="img/close.png" style={{display: 'none'}}/></a>
                        </div>
                        <div className="t-content">
                            <p>创新产品形态</p>
                            <div className="line"></div>
                            <img alt="1" src="img/img_04/xly_04.png"/>
                            <p className="other-t">项目经理、专属班班、实战教练、教学导师的四位一体服务运营体系，完成教学、训练、答疑、促学等一站式培训服务。</p>
                        </div>
                    </div>
                    <div className="topicBox">
                        <div className="t-title">
                            <span>“现在时”导向</span>
                            <a href="#!"><img alt="1" src="img/open.png"/><img alt="1" src="img/close.png" style={{display: 'none'}}/></a>
                        </div>
                        <div className="t-content">
                            <p>“现在时”导向</p>
                            <div className="line"></div>
                            <img alt="1" src="img/img_04/xly_06.png"/>
                            <p className="other-t">基于企业“现在”所需解决的实际问题，有针对性地培养人才、解决问题和拉通团队。</p>
                        </div>
                    </div>
                    <div className="topicBox">
                        <div className="t-title">
                            <span>里程碑式的项目把控</span>
                            <a href="#!"><img alt="1" src="img/open.png"/><img alt="1" src="img/close.png" style={{display: 'none'}}/></a>
                        </div>
                        <div className="t-content">
                            <p>里程碑式的项目把控</p>
                            <div className="line"></div>
                            <img alt="1" src="img/img_04/xly_05.png"/>
                            <p className="other-t">里程碑”式的项目把控让交付全流程可管可控可展示。</p>
                        </div>
                    </div>
                    <div className="topicBox">
                        <div className="t-title">
                            <span>学员分层运营</span>
                            <a href="#!"><img alt="1" src="img/open.png"/><img alt="1" src="img/close.png" style={{display: 'none'}}/></a>
                        </div>
                        <div className="t-content">
                            <p>学员分层运营</p>
                            <div className="line"></div>
                            <img alt="1" src="img/img_04/xly_07.png"/>
                            <p className="other-t">依据每日、每周、每模块、整体的学勤实时数据，分层对学员进行运营管理，保证完课率。</p>
                        </div>
                    </div>
                </div>
                <div className="train">
                    <h1 className="h1Tit">培训方式</h1>
                    <img alt="1" src="img/img_04/xly_02.png" className="img-full"/>
                </div>
                <div className="feature bg-grey">
                    <h1 className="h1Tit">实战主题</h1>
                    <p className="subTit">大赛通过赛训结合、以赛促效的模式，帮助发掘并培养数字化创新应用人才，助力数字化转型，形成“员工自身成长、公司业务增长、实训文化生长”的良性循环。</p>
                    <div className="xly-feature">
                        <div className="xly-featureWrap">
                            <img alt="1" src="img/img_04/xly_08.png"/>
                            <img alt="1" src="img/img_04/xly_09.png"/>
                            <img alt="1" src="img/img_04/xly_10.png"/>
                            <img alt="1" src="img/img_04/xly_11.png"/>
                        </div>
                    </div>
                    <div className="nav-btn">
                        <a href="#!" className="on"> </a>
                        <a href="#!"> </a>
                        <a href="#!"> </a>
                        <a href="#!"> </a>
                    </div>
                </div>
                <div className="solution">
                    <h1 className="h1Tit">开课吧企业服务已为上千家企业提供解决方案</h1>
                    <a href="#!">获取定制方案</a>
                </div>

                <H5Tailer/>
            </div>
        )
    }
}